import ChromeSlot from '@akinon/pz-theme/src/chrome/chrome-slot';
import { PLACEHOLDER_SLUGS } from '@akinon/pz-theme/src/chrome/placeholder-slugs';

/**
 * The login screen is handed to the theme editor here rather than in page.tsx,
 * because the slot is an async server component and the page is a client one.
 * With no composition published the slot renders the page untouched.
 *
 * The slot lives in a `(login)` route group so the composition covers exactly
 * this screen: `auth/oauth-login` is a provider callback, and a login body
 * mounted one level up would replace it too.
 *
 * No `pageContext`: an auth screen fetches no commerce data, and the blocks a
 * designer rebuilds it from (`auth-form`, `register-form`, `oauth-buttons`)
 * read the session client-side.
 *
 * Login and register stay on this ONE screen. Whether they read as tabs or as
 * two forms side by side is composed here (the starter templates ship both
 * shapes), so no second route is involved.
 */
export default function LoginLayout({
  children
}: {
  children: React.ReactNode;
}) {
  return (
    // `contents` on both wrappers keeps the slot chain layout-transparent, so
    // an uncomposed login page keeps its own box model even where a brand's
    // <main> is a flex or grid container.
    <ChromeSlot
      slug={PLACEHOLDER_SLUGS.auth}
      fallback={children}
      className="contents"
      fallbackClassName="contents"
    />
  );
}